<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
	<th:block th:include="include :: header('文件上传')" />
	<th:block th:include="include :: bootstrap-fileinput-css" />
	<link th:href="@{/css/common.css}" rel="stylesheet"/>
	<link th:href="@{/css/choose_data_map.css}" rel="stylesheet" />
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight add-question">
	<div class="row">
		<div class="col-sm-12">
			<div class="ibox-content">
				<form class="form-horizontal" id="commentForm">
					<input type="hidden" name="interfaceId" th:value="${interfaceId}">
					<input type="hidden" name="type" th:value="${type}">
					<div class="form-group">
						<div class="file-loading">
							<input id="multipleFile" name="files" type="file" multiple>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: bootstrap-fileinput-js" />
<script th:inline="javascript">
	// 接口uri
	var parentId = [[${parentId}]]
	const prefix = ctx + "interface/interface";
    var fileInfList = [];
    $(document).ready(function () {
		setTimeout(function(){$(".file-drop-zone-title").html("拖拽图片到这里 …<br>支持多图片同时上传")},0);
		$("#multipleFile").fileinput({
			uploadUrl: ctx + 'common/uploads',
			uploadAsync: false,
			showClose: false
		}).on('filebatchuploadsuccess', function(event, data, previewId, index) {
			let rsp = data.response;
			let fileJson = rsp.data;
			for (var i in fileJson) {
				let fileInf = {};
				fileInf.fileName = fileJson[i].fileName;
				fileInf.filePath = fileJson[i].filePath;
				fileInf.parentId = parentId;
				fileInfList.push(fileInf);
			}
		}).on('fileremoved', function(event, id, index) {
			$("input[name='" + event.currentTarget.id + "']").val('')
		})
    });

	function submitHandler() {
		if (fileInfList.length == 0) {
			$.modal.alertError("请上传图片");
			return false;
		}
		if($("input[name='type']").val()=='1'){
		    if(fileInfList.length>1){
                $.modal.alertError("请选择单张图片");
                return false;
			}
            $.modal.close();
            // 父页面更新
            parent.editImage({id:parentId,
                objectId:$("input[name='interfaceId']").val(),
                objectType:1,
                fileName:fileInfList[0].fileName,
                filePath:fileInfList[0].filePath},$("input[name='interfaceId']").val(),true);
		    return false;
		}
        var params = {
            "fileInfList": fileInfList,
            "interfaceId": $("input[name='interfaceId']").val()
        };
		var config = {
			url: prefix + "/addBffImg",
			type: "POST",
			dataType: "json",
			data: JSON.stringify(params),
			contentType: "application/json",
			beforeSend: function () {
				$.modal.loading("正在处理中，请稍后...");
				$.modal.disable();
			},
			success: function(result) {
				$.modal.closeLoading();
				if (result.code == web_status.SUCCESS) {
					$.modal.close();
					// 父类问题列表 reload
					if(typeof  parent.relationPageList=='function'){
                        parent.relationPageList();
					}
                    if(typeof  parent.interfacePartImg=='function'){
                        parent.interfacePartImg($("input[name='interfaceId']").val());
                    }
					return false;
				}
				if (result.code == web_status.WARNING) {
					$.modal.alertWarning(result.msg);
					return false;
				}
				$.modal.alertError(result.msg);
			}
		};
		$.ajax(config);
	}
</script>
</body>
</html>

